<template>
    <view :style="objColor">
        <!-- mine/pages/problemFeedback/problemFeedback.wxml -->
        <view>
            <view class="problem">
                <view>
                    <text class="feedBack-label">*</text>
                    <text class="feedBack-type">反馈类型</text>
                </view>
                <view class="problem-type" @tap="selectType" v-if="feedbackVarietyId == item.value" v-for="(item, index) in feedbackDictList" :key="index">{{ item.name }} ></view>
                <view class="problem-type" @tap="selectType" v-if="feedbackType == 'other'">其他</view>
            </view>
            <!-- 反馈内容 -->
            <view class="feedBack-content">
                <view class="content-header">
                    <view>
                        <text class="feedBack-label">*</text>
                        <text class="feedBack-type">反馈类型</text>
                    </view>
                    <view class="textareaNum">{{ feedbackText.length ? feedbackText.length : 0 }}/500</view>
                </view>
                <view class="textarea-wrap">
                    <textarea
                        name=""
                        id=""
                        cols="8"
                        rows="8"
                        :value="feedbackText"
                        @input="getInput"
                        maxlength="500"
                        placeholder="请填写你的建议和反馈"
                        class="textarea"
                        placeholder-class="placeholder-class"
                    ></textarea>
                </view>
            </view>
            <!-- 反馈相关图片 -->
            <view class="feed-picture">
                <view class="picture-header">
                    <view class="picture-label">反馈相关图片</view>
                    <view class="pictureNum">{{ fileList.length }}/8</view>
                </view>
                <view class="upload-images">
                    <!-- <van-uploader :file-list="fileList" @after-read="afterRead" max-count="8" :deletable="true" :preview-image="true"  /> -->
                    <uni-file-picker
                        v-model="fileList"
                        file-mediatype="image" 
                        limit="8" 
                        del-icon 
                        @select="afterRead"
                        @delete="deleteFun"
                    >
                    </uni-file-picker>
                </view>
            </view>
            <view class="phone">
                <view class="phone-label"><text class="feedBack-label">*</text>联系方式</view>
                <view class="input-wrap">|</view>
                <view class="input-wrap">
                    <input
                        @input="setTelephone"
                        :value="telephone"
                        placeholder-class="placeInput"
                        class="input"
                        placeholder="可留下手机号或邮箱地址，方便我们与您联系"
                    />
                </view>
            </view>
            <view :class="feedbackText.length||setTelephone.length ? 'submitFeedBack':'submitFeedBack2'" @tap="submit">提交反馈</view>
        </view>

        <uni-popup :show="show" position="bottom" @close="onClose">
            <view class="type-wrap">
                <view :data-id="item.value" @tap="tapType" v-for="(item, index) in feedbackDictList" :key="index">
                    <view class="type">{{ item.name }}</view>
                </view>
            </view>
        </uni-popup>
    </view>
</template>

<script>
'use strict';
// import vanUploader from '@vant/weapp/uploader/index';
// import vanPopup from '@vant/weapp/popup/index';
const app = getApp()
var __assign =
    (this && this.__assign) ||
    function () {
        __assign =
            Object.assign ||
            function (t) {
                for (var s, i = 1, n = arguments.length; i < n; i++) {
                    s = arguments[i];

                    for (var p in s) {
                        if (Object.prototype.hasOwnProperty.call(s, p)) {
                            t[p] = s[p];
                        }
                    }
                }

                return t;
            };

        return __assign.apply(this, arguments);
    };

// exports.__esModule = true; // mine/pages/problemFeedback/problemFeedback.ts

var https_1 = require('./../../../api/https.js');

export default {
    components: {
        // vanUploader,
        // vanPopup
    },
    data() {
        return {
            showSubit:false,
            imgUrl: app.globalData.URL,
            imgList: [],
            fileList: [],
            feedbackImgList: [],
            feedbackText: '',
            show: false,

            feedbackDictList: [
                {
                    type: '投诉'
                },
                {
                    type: '建议'
                },
                {
                    type: '售后'
                },
                {
                    type: '其他'
                }
            ],

            telephone: '',
            feedbackType: '1',
            stationId: '',
            feedbackVarietyId: ''
        };
    },
    /**
     * 生命周期函数--监听页面加载
     */
    onLoad: function (options) {
        // options.feedbackType === 'other'代表站点反馈
        if (options.feedbackType === 'other') {
            this.feedbackType= options.feedbackType;
            this.stationId= options.stationId;
        } else {
            this.feedbackVarietyId= options.feedbackVarietyId
        }

        this.getFeedbackDict();
        // this.getInfo()


        if (uni.getStorageSync('token')) {
            this.getInfo()
        }
    },
    methods: {
        // 获取个人信息
        getInfo(){
             https_1.getMemberPersonalData().then(res=>{
			    if (res.code == 0) {
			        this.$nextTick(() => {
			            const {telephone} = res.data
			            this.telephone = telephone?telephone:''
			        })
			        
			    }  
			})
        },
        // 获取反馈字典
        getFeedbackDict: function () {
            this.feedbackDictList= uni.getStorageSync('feedbackDictList') || []
        },

        getInput: function (e) {
            this.feedbackText=e.detail.value
        },

        setTelephone: function (e) {
            this.telephone= e.detail.value
        },

        afterRead: function (event) {
            this.showSubit = true
            uni.showLoading({
                title: '图片上传中...',
                mask: true
            });
            // console.log(event)
            const files = event.tempFiles
            var that = this;
            // 处理多文件上传
            files.map(item => {
                uni.uploadFile({
                url: that.imgUrl + '/member-service/common/upload',
                filePath: item.path,
                name: 'file',
                formData: {
                    user: 'test'
                },
                success: function (res) {
                    // console.log(res, 8888);
                    var data = JSON.parse(res.data);

                    if (data.code == 0) {
                        let fileArr = [{...item, url: data.data}]
                        var fileList = that.fileList.concat(fileArr);
                        var urlArr = [data.data];
                        var imgList = that.feedbackImgList.concat(urlArr);
                        that.fileList=fileList;
                        that.feedbackImgList= imgList;
                        that.showSubit = false
                        uni.hideLoading()
                    }
                },
                fail: function () {
                    that.showSubit = false
                    uni.hideLoading()
                    uni.showToast({
                        title: '上传失败',
                        icon: 'none',
                        duration: 2000
                    });
                }
            });
            })
            
        },

        saveStationFeedback: function () {
            var that = this;
            var memberId = uni.getStorageSync('memberId'); // console.log(tmp.data.feedbackText)
            // console.log()
            var reg_tel = /^(13[0-9]|14[01456879]|15[0-35-9]|16[2567]|17[0-8]|18[0-9]|19[0-35-9])\d{8}$/; //11位手机号码正则 
            var reg = /^\w+([-+.]\w+)*@\w+([-.]\w+)*\.\w+([-.]\w+)*$/;
            if (!that.feedbackImgList.length && !that.feedbackText) {
                uni.showModal({
                        title: '温馨提示',
                        content: '请填写反馈信息',
                        confirmColor: that.objColor2.textColor,
                        showCancel: false,
                        success: function(res) {
                        }
                    });
            } else if(!that.telephone){
                    uni.showModal({
                        title: '温馨提示',
                        content: '请输入联系方式',
                        confirmColor: that.objColor2.textColor,
                        showCancel: false,
                        success: function(res) {
                        }
                    });
            } else if(!reg_tel.test(that.telephone)&&!reg.test(that.telephone)){
                // uni.showToast({
				// 		title: '请输入正确手机号或者邮箱号',
				// 		icon: 'none',
				// 		duration: 2000
				// 	});
                uni.showModal({
                    title: '温馨提示',
                    content: '请输入正确手机号或者邮箱号',
                    confirmColor: that.objColor2.textColor,
                    showCancel: false,
                    success: function(res) {
                    }
                });
            }  else {
                var back_1 = function () {
                    uni.showToast({
                        title: '提交成功',
                        icon: 'none',
                        duration: 2000
                    });
                    setTimeout(function () {
                        // uni.showModal({
                        //     title: '消息提示',
                        //     content: '感谢您百忙之中以反馈的方式告诉我们产品的不足，我们会持续改进的',
                        //     confirmText: '返回上页',
                        //     confirmColor: '#1487FA',
                        //     showCancel: false,
                        //     success: function (r) {
                        //         if (r.confirm) {
                        //             uni.navigateBack({
                        //                 delta: 1
                        //             });
                        //         }
                        //     }
                        // });
                        uni.navigateTo({
                            url: '../godaddySuccess/godaddySuccess?msg='+'感谢您百忙之中以反馈的方式告诉我们产品的不足，我们会持续改进的'
                        });
                    }, 1000);
                }; // 其他反馈

                if (this.feedbackType == 'other') {
                    https_1
                        .saveStationFeedback({
                            stationId: that.stationId,
                            userId: memberId,
                            feedbackType: 4,
                            feedbackText: that.feedbackText,
                            feedbackImgList: that.feedbackImgList,
                            contactInformation:that.telephone
                        })
                        .then(function (res) {
                            if (res.code == 0) {
                                back_1();
                            }
                        })
                        ['catch'](function (err) {
                            console.log(err);
                        });
                } else {
                    https_1
                        .addMyFeedback({
                            feedbackVarietyId: that.feedbackVarietyId,
                            feedbackContent: that.feedbackText,
                            imgList: that.fileList.map(function (e) {
                                return e.url;
                            }),
                            telephone: that.telephone
                        })
                        .then(function (res) {
                            if (res.code == 0) {
                                back_1();
                            }
                        });
                }
            }
        },

        selectType: function () {
            if (this.feedbackType == 'other') {
                return;
            }

            this.show= true
        },

        onClose: function () {
            this.show= false
        },

        tapType: function (e) {
            // console.log(e)
            var id = e.currentTarget.dataset.id;
            this.feedbackVarietyId=id,
                this.show= false
        },

        submit: function () {
            // this.saveStationFeedback();

            app.globalData.CHECK_LOGIN_Toast(()=>{
                this.saveStationFeedback();
			},'请先进行登录!')
            
        },

        deleteFun: function (e) {
            const index = this.feedbackImgList.findIndex(item => item=== e.tempFilePath);
            this.feedbackImgList.splice(index, 1);
            // this.fileList.splice(index, 1);
            // this.fileList=this.fileList;
            // this.feedbackImgList=this.feedbackImgList;
        }
    }
};
</script>
<style lang="less">
@import url('./problemFeedback.less');
</style>
